<template>
  <el-select style="width: 100%" v-model="shopName" value-key="id" clearable filterable placeholder="产品"
             :filter-method="remoteMethod" @change="selectGoods">
    <el-option v-for="item in shopList" :key="item.id" :label="item.name" :value="item">
    </el-option>
  </el-select>
</template>

<script>
import {list} from '@/api/goods'
import utils from '../../utils/utils.js'
export default {

  props: ["shopname"],
  // props: {
  // queryTitle:{
  //   type:String,
  //     value:'请选择公司名称'
  // },
// },
  data() {
    return {
      shopName: '',
      shopList: [],
      query:{
        shopId:'',
        name:""
      }
    }
  },
  watch:{
    shopname(newval,oldval){
      this.shopName=newval
    }
  },
  created(){
    if(!utils.isNull(this.shopname)){
      this.shopName=this.shopname
    }
    var _this = this
    _this.loadShop('')
  },
  methods: {
    remoteMethod(query) {
      this.loadShop(query)
    },
    loadShop(query) {
      var _this = this
      let params = new URLSearchParams();
      params.append('keyword', query)
      list(params).then(response => {
        _this.shopList = response.data.data
        if(!utils.isNull(_this.shopname)){
          _this.shopName=_this.shopname
        }
      })
    },
    selectGoods(e) {
      if (!utils.isNull(e)) {
        this.query.shopId = e.id
        this.query.name = e.title
        this.query.name = e.name
      } else {

        this.query.shopId=""
        this.query.name = ''
      }
      this.$emit('queryGoodsClick',this.query)
    },
  },
}
</script>

<style>
</style>
